/**
 * 移动端生成html
 */
import 'monaco-editor/esm/vs/editor/contrib/find/findController.js';
import baidu from 'baidutemplate/baiduTemplate'
import control from "@/views/modules/form/core/js/template/control";
import subTableBlock from "@/views/modules/form/core/js/template/subTableBlock";
import subTableList from "@/views/modules/form/core/js/template/subTableList";
import tabsTemplate from "@/views/modules/form/core/js/template/tabsTemplate";
import {I18Parse} from "@lowcode/jpaas-common-lib";
import {Util} from '@lowcode/jpaas-common-lib'
import jsLang from '@/locales/lang/impl/form/jsLang';
let lang = jsLang;

let i18n=function (langKey,text) {
    return I18Parse.getI18Val(lang.jsLang.FormMobileGenHtml,langKey, text)
}

export default {
    data() {
        return {
        }
    },
    created() {

    },
    methods: {
        genHtml(){
            var self=this;
            this.$confirm({
                title: self.$ti18('rxMsa.actionTips','操作提示'),
                zIndex:40000,
                content: i18n('current','您确定要覆盖当前HTML吗？'),
                okText: self.$ti18('rxForm.ackBtn','确认'),
                cancelText: self.$ti18('rxForm.cancelBtn','取消'),
                onOk() {
                 self.genTemplate();
                },
                onCancel(){}
            })
        },
        clearHtml(){
            var self=this;
            this.$confirm({
                title:self.$ti18('rxMsa.actionTips','操作提示'),
                content: i18n('current','您确定要覆盖当前HTML吗？'),
                zIndex:40000,
                okText:self.$ti18('rxForm.ackBtn','确认'),
                cancelText:self.$ti18('rxForm.cancelBtn','取消'),
                onOk() {
                    self.$set(self.formConf.boEnt,"html","");
                },
                onCancel(){}
            })
        },
        //生成模板
        genTemplate(){
            var template_ = "<div><rx-message ref=\"message\"></rx-message></div>";
            var tabs=[];
            var boAttrList=JSON.parse(JSON.stringify(this.formConf.boEnt.boAttrList))
            if(boAttrList &&  boAttrList.length>0){
                //主表、子表、分组
                for (let i = 0; i < boAttrList.length; i++) {
                    var attr=boAttrList[i];
                    //将tab方式的分组单独取出
                    if (attr.group && attr.tab) {
                        tabs.push(attr);
                        boAttrList.splice(i,1);
                        i--;
                    }else {
                        //有alias代表当前是子表
                        if(!attr.alias){
                            var config={attr:attr,subname:"main"};
                            template_+=baidu.template(control,config);
                        }else {
                            if(attr.boAttrList && attr.boAttrList.length>0){
                                var config={subTable:attr,subname:attr.alias};
                                if(attr.pattern == 'list'){
                                    template_+=baidu.template(subTableList,config);
                                }else {
                                    template_+=baidu.template(subTableBlock,config);
                                }
                            }
                        }
                    }
                }
                //tab
                if(tabs.length>0){
                    template_+='<div class="tabs-template"><rx-grouping-tabs :current="current" :tabList="tabList" ></rx-grouping-tabs>'
                    template_+='</div>'
                    for (let i = 0; i < tabs.length; i++) {
                        var config={tab:tabs[i],subname:"main"};
                        template_+=`<div class="tabs-content" v-if="${i} == current">`+baidu.template(tabsTemplate,config)+`</div>`;
                    }
                    template_+=`<div class="tabs-button">
                                        <div class="tabs-button-back " v-if="current !=0" @click='back'>
                                        <i class="iconfont icon-zuojiantou-01"></i>
                                        </div>
                                        <div class="tabs-button-next" v-if="current != ${tabs.length-1}" @click='next'>
                                          <i class="iconfont icon-youjiantou-01"></i>
                                        </div>
                                 </div></div>`;
                }
            }
            this.$set(this.formConf.boEnt,"html",'<div>'+template_+'</div>');
            this.$refs.mobileHtml.monacoEditor.getAction(['editor.action.formatDocument'])._run();
            this.key=Util.randomId();
        }
    }
}